<template>
    <fieldset>
        <legend>modal封装</legend>
        <container :visible="visible" @on-confirm="confirm" @on-cancel="cancel"></container>
        <button @click="showModal" >点击显示模态框</button>
    </fieldset>
</template>

<script>
    import container from "./container"
    export default{       
        data(){
            return{
                visible:false
            }
        },
        components:{
            container           
        },
        methods:{
            showModal(){
                this.visible = true
            },
            confirm(){
                this.visible = false
            },
            cancel(){
                this.visible = false
            }
        }
    }
</script>